import React, {useEffect, useState} from "react"
import {apiGetList} from '../api'
import eventProxy from "../utils"

const List = () => {

    const [list, setList] = useState([])

    useEffect(() => {
        getList({})
        
    }, [])

    // 接收类型
    eventProxy.on('getTrademark', (value) => {
        getList({trademark: value})
    })
    
    // 接收首付
    eventProxy.on('getDownPrice', (value) => {
        getList({downPrice: value})
    })

    const getList = (obj) => {
        apiGetList(obj).then(res => {
            setList(res.data)
            console.log(res)
        })
    }
    return <div className="list-box">
        {
            list.length && list.map((item, idx) => {
                return <div key={idx} className="list-item">
                    <img src={item.img} alt="" />
                    <div>
                        <h2>{item.title}</h2>
                        <p>类型：{item.trademark}</p>
                        <p>首付：{item.downPrice}</p>
                    </div>
                </div>
            })
        }
    </div>
}

export default List